<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="./landing/css/style.css"/>
<!-- Main container -->
<div class="page-container">
    <div class="row main" id="js-main">
        <div class="col-sm-8">
            <h2 class="mg-lg Landing-title">JavaScript Primer</h2>
            <h3 class="mg-sm">
                <span class="fa fa-book"></span>迷わないための入門書
            </h3>
            <p class="mg-lg">
                <a href="https://twitter.com/share" class="twitter-share-button" data-size="large">Tweet</a>
                <a class="github-button" href="https://github.com/asciidwango/js-primer/subscription" data-size="large"
                   data-show-count="true" aria-label="Watch asciidwango/js-primer on GitHub">Watch</a>
                <a class="github-button" href="https://github.com/asciidwango/js-primer" data-size="large"
                   data-show-count="true" aria-label="Star asciidwango/js-primer on GitHub">Star</a>
            </p>
            <p class="mg-lg">
                これからJavaScriptに入門したい人が、ECMAScript 2015以降をベースにして一からJavaScriptを学べる本です。<br/>
                プログラミングをやったことがあるが、今のJavaScriptがよくわからないという人が、
                今のJavaScriptアプリケーションを読み書きできるようになるように書かれています。
            </p>
            <p class="mg-lg">
                初めてのプログラミング言語としてJavaScriptを学ぶ人は、まずは「<a href="https://jsprimer.net/intro/">はじめに</a>」から読んでみてください。<br/>
            </p>
            <form action="https://github.us13.list-manage.com/subscribe/post?u=fc41e11a2b9dc6f05350e0de0&amp;id=7ab1594ae8"
                  method="post" id="js_mail_form" novalidate class="mail-form" target="_blank">
                <h3 class="mg-sm">
                    <span class="fa fa-star"></span>更新情報を購読
                </h3>
                <p class="mg-lg">
                    この本は現在実装中であるため、予告なしに変更される可能性があります。<br/>
                    この本の更新情報を受け取りたい方はメールアドレスを登録することで通知を受け取れます。<br/>
                    この本がリリースされるタイミングなどの情報を受け取れます。
                </p>
                <div class="form-group">
                    <label>
                        メールアドレス
                    </label>
                    <input id="email" class="form-control" name="EMAIL" type="email" required/>
                </div>
                <button class="bloc-button btn btn-d btn-lg btn-block" type="submit">
                    登録
                </button>
            </form>
        </div>
        <div class="col-sm-4">
            <img src="./landing/img/cover.png" alt="Cover Image" class="img-responsive hidden-xs"/>
        </div>
    </div>
</div>

<script async defer src="https://buttons.github.io/buttons.js"></script>
<script async defer>!function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? "http" : "https";
    if (!d.getElementById(id)) {
        js = d.createElement(s);
        js.id = id;
        js.src = p + "://platform.twitter.com/widgets.js";
        fjs.parentNode.insertBefore(js, fjs);
    }
}(document, "script", "twitter-wjs");</script>
<!-- Main End -->
